@import url(http://fonts.googleapis.com/css?family=Prosto+One);

html, body {
  margin:20px 0px 0px 0px;
  padding:0px;
  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
}

.monitrix-row {
  width:80%;
  margin:0px auto;
  min-width:920px;
}

.monitrix-header {
  width:100%;
  margin:0px 0px 30px 0px;
  padding:30px 0px;
  color:#fff;
  background:#582828; /* Old browsers */
  background:-moz-linear-gradient(45deg,  #582828 0%, #351515 100%); /* FF3.6+ */
  background:-o-linear-gradient(45deg,  #582828 0%,#351515 100%); /* Opera 11.10+ */
  background:-ms-linear-gradient(45deg,  #582828 0%,#351515 100%); /* IE10+ */
  background:-webkit-gradient(linear, left bottom, right top, color-stop(0%,#582828), color-stop(100%,#351515)); /* Chrome,Safari4+ */
  background:linear-gradient(45deg,  #582828 0%,#351515 100%); /* W3C */
  filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#582828', endColorstr='#351515',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
  text-shadow:0 1px 3px rgba(0, 0, 0, .4), 0 0 30px rgba(0, 0, 0, .075);
  -webkit-box-shadow: inset 0 3px 7px rgba(0, 0, 0, .1), inset 0 -3px 7px rgba(0, 0, 0, .1), 0 1px 3px rgba(0, 0, 0, .2);
  -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.1), inset 0 -3px 7px rgba(0,0,0,.1), 0 1px 3px rgba(0, 0, 0, .2);
  box-shadow: inset 0 3px 7px rgba(0, 0, 0, .1), inset 0 -3px 7px rgba(0, 0, 0, .1), 0 1px 3px rgba(0, 0, 0, .2); 
}

.monitrix-header h1 { margin:0px; font-size:50px; font-family:"Prosto One"; z-index:2; }
.monitrix-header p { margin:0px; padding:5px 0px 5px 2px; font-size:15px; z-index:2; }
.monitrix-crawl-factoid { color: #d77; font-style:italic; z-index:2; }

.monitrix-h1-subline {
  color:#777;
  font-size:14px;
  font-weight:normal;
}

#monitrix-flash-panel {
  position:absolute;
  width:60%;
  top:51px;
  right:10px;
  height:109px;
}

.monitrix-flash-url {
  position:absolute;
  opacity:0;
  font-size:1.3em;
  white-space:no-wrap;
  z-index:1;
}

.monitrix-flash-url a {
  text-decoration:none;
  color:#fff;
}

.monitrix-current-stats {
  width:100px;
  padding:5px 15px;
  margin:0px 10px;
  text-align:center;
  font-size:12px;
}

.monitrix-current-stats div {
  margin:0 auto;
}

.monitrix-alert-table {
  font-size:13px;
}

.monitrix-host-piechart {
  margin:20px 30px 0px 0px;
  display:inline-block;
  text-align:center;
  font-size:13px;
}

.monitrix-host-piechart-inner {
  width:240px; 
  height:150px;
}

.monitrix-host-pielchart-legend {
  margin:30px 0px 50px 0px;
}

.monitrix-host-pielchart-legend td {
  font-size:10px;
}

.monitrix-three-column-text {
  -moz-column-count: 3;
  -webkit-column-count: 3;
  -moz-column-gap: 20px;
  -webkit-column-gap: 20px;
}

.graph-thumb-container {
  position:relative;
  margin:20px 0px 40px 0px;
  padding-top:20px;
  min-height:180px;
  clear:both;
}

.graph-thumb {
  position:absolute;
  top:0px;
  left:40px;
  width:280px;
  height:180px;
  border-width:0px 1px 0px 0px;
  border-style: solid;
  border-color: #ccc;
  text-align:center;
}

.load-progress {
	position:relative;
	left:-10px;
	display:block;
	padding-top:40px;
	padding-right:300px;
	font-weight:bold;
	width:100%;
	text-align:center;
}

.monitrix-graph-thumb-fullscreen {
  display:inline-block;
  padding:5px 40px 0px 40px;
}

.monitrix-graph-thumb-fullscreen a {
  text-decoration:none;
  color:#000;
}

.graph-tumb-loading {
  background-image:url('../img/ajax-spinner.gif');
  background-repeat:no-repeat;
  background-position:50% 50%;
  border-width:1px;	
}

.graph-thumb-y-axis {
  position:absolute;
  top:0px;
  left:0px;
  width:40px;
  height:180px;
  padding-top:20px;
}

.monitrix-hostinfo-label {
  white-space:nowrap;
  font-weight:bold;
  padding:2px 15px 2px 0px;
}

.monitrix-tabs {
  margin-top:20px;
  border-bottom:1px solid #ccc;
}

.monitrix-tab {
  color:#626262;
  border-width:1px 1px 0px 1px;
  border-style:solid;
  border-color:#ccc;
  padding:5px 10px;
  display:inline-block;
    
  -moz-border-radius-topleft:3px;
  -moz-border-radius-topright:3px;  
  border-top-left-radius:3px;
  border-top-right-radius:3px;
}

.monitrix-tab-active {
  background-color:#eee;
}

.monitrix-tab:hover {
  background-color:#eee;
  text-decoration:none; 
  color:#000; 
}

.not-loaded {
  position:relative;
  background-color:#fcfcfc;
  border-style:solid;
  border-width:1px;
  border-color:#ccc #eaeaea #e8e8e8 #ccc;
}

.loading {
  background-image:url('../img/ajax-spinner.gif');
  background-repeat:no-repeat;
  background-position:50% 50%;
}

.load-button {
  position:absolute;
  top:50%;
  width:100%;
  margin-top:-10px;
  text-align:center;
}

.not-loaded .monitrix-barchart-container {
  opacity:0;
}

.monitrix-barchart-container {
 position:relative;
}

.monitrix-barchart-container a, .monitrix-barchart-container a:hover {
 color: #666 !important;
}

.monitrix-barchart-container-small {
  clear:both;
  position:relative;
  width:370px;
}

.monitrix-barchart-container-right {
  display:inline-block;
  height:250px;
}

.monitrix-barchart-container-right-small {
  display:inline-block;
  width:340px;
  position:relative;
  margin-left:40px;
}

.monitrix-barchart-y-label-container {
  display:inline-block;
  position:absolute;
  top:0px;
  left:0px;
  width:80px;
  height:230px;
  margin-top:20px;
}

.monitrix-barchart-y-label-container-small {
  display:inline-block;
  position:absolute;
  top:0px;
  left:0px;
  width:40px;
  height:230px;
  margin-top:20px;
}
        	  
.monitrix-barchart-y-label {
  display:block;
  height:30px;
  width:230px;
  position:absolute;
  top:10px;
  left:-140px;
  -webkit-transform:rotate(-90deg);
  -moz-transform:rotate(-90deg);
  -ms-transform:rotate(-90deg);
  -o-transform: rotate(-90deg);
}

.monitrix-barchart-y-label-small {
  display:block;
  position:absolute;
  width:180px;
  text-align:center;
  top:120px;
  left:-85px;
  -webkit-transform:rotate(-90deg);
  -moz-transform:rotate(-90deg);
  -ms-transform:rotate(-90deg);
  -o-transform: rotate(-90deg);
}

.monitrix-barchart-x-label {
  height:30px;
  position:relative;
  top:-10px;
  width:700px;
  margin-left:80px;
  text-align:center;
}

.monitrix-barchart-x-label-small {
  width:310px;
  position:relative;
  left:40px;
  margin-top:10px;
  text-align:center;
}

.monitrix-barchart-chart-area {
  height:220px;
  width:700px;
  margin-left:80px;
}

.monitrix-barchart-chart-area-small {
  width:290px;
  height:200px;
  margin-left:20px;
  margin-top:20px;
  display:inline-block;
}

.monitrix-barchart-axis-area {
  position:absolute;
  top:46px;
  left:30px;
}

.monitrix-barchart-axis-area-small {
  width:40px;
  position:absolute;
  left:-20px;
  top:20px;
  display:inline-block;
}

.rickshaw-graph {
  margin-left:30px;
  height:160px !important;
  margin-top:30px;
  margin-bottom:20px;
}

.rickshaw-graph svg {
  border-width:1px 0px 0px 0px;
  border-style:dotted solid solid solid;
  border-color:#ccc;
}

.rickshaw_graph .x_label {
  bottom: 30px;
}

.monitrix-image-qa-result {
  display:inline-block;
  margin:20px 50px 40px 0px;
}

.monitrix-image-qa-thumb {
  width:240px;
  height:180px;
  border:1px solid #ccc;
}